<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<link rel="stylesheet" type="text/css" href="../../extSDK_2.2.1bak/resources/css/ext-all.css" />
	<script type="text/javascript" src="../../extSDK_2.2.1bak/adapter/ext/ext-base.js"></script>
	<script type="text/javascript" src="../../extSDK_2.2.1bak/ext-core-debug.js"></script>
	<script type="text/javascript" src="../../extSDK_2.2.1bak/ext-all-debug.js"></script>
	<script type="text/javascript" src="./TreeStoreLoader.js"></script>
	<link rel="stylesheet" type="text/css" href="../../extModules/resources/menuTree/menuTree.css" />

<title>测试页</title>
</head>

<body>

<br>
  <script>

Ext.onReady(function(){

//定义表格
var grid = new Ext.grid.PropertyGrid({
title:'属性表格',
renderTo: 'grid',
width:300,
autoHeight: true,
source: {
"名字":"张三",
"创建时间":new Date(Date.parse('12/15/2007')),
"是否有效":false,
"版本号": .01,
"描述":"descn"

}

});

//可选的。用来控制VALUE是不是可修改的
grid.on("beforeedit",function(e) {
e.cancel = true;
return false;
});

});


//为了取消NAME那一列的默认排序
Ext.grid.PropertyGrid.prototype.initComponent = function () {
this.customEditors = this.customEditors || {};
this.lastEditRow = null;
var store = new Ext.grid.PropertyStore(this);
this.propStore = store;
var cm = new Ext.grid.PropertyColumnModel(this,store);
// store.store.sort('name','ASC');
this.addEvents(
'beforepropertychange',
'propertychange'
);
this.cm = cm;
this.ds = store.store;
Ext.grid.PropertyGrid.superclass.initComponent.call(this);

this.selModel.on('beforecellselect',function(sm,rowIndex,colIndex) {
if(colIndex == 0) {
this.startEditing.defer(200,this, [rowIndex,1]);
return false;
}
},this);
};

    </script>
   

<table border="1" align="center">
<tr>
<td><font color="red">PropertyGrid表格样式如下：</font></td>
</tr>
<tr>
<td><div id="grid" > </div></td>
</tr>
<tr>
<td><input type="submit" id="remove" value="提交内容"/></td>
</tr>

</table>
</body> 

</html>